import React from 'react';
import { Layout } from 'antd';
import Header from './Header';
import Sidebar from './Sidebar';
import './MainLayout.css';

const { Content, Footer } = Layout;

const MainLayout = ({ children }) => {
  console.log('MainLayout组件渲染，子组件:', children);
  
  return (
    <Layout style={{ minHeight: '100vh' }}>
      <Sidebar />
      <Layout className="site-layout">
        <Header />
        <Content style={{ margin: '16px' }}>
          <div className="site-layout-background" style={{ padding: 24, minHeight: 360 }}>
            {children}
          </div>
        </Content>
        <Footer style={{ textAlign: 'center' }}>
          Integrated Trouble Tracking System ©2023 Created by ITS Team
        </Footer>
      </Layout>
    </Layout>
  );
};

export default MainLayout;